<template>
  <div class="editStuInfo">
    <div class="c-fs24 c-fc-xblack c-ph24">
      <div class=" c-hh80 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center">
        <div class=""><span class="c-mr6 c-fc-xlred c-fs28">*</span>姓名</div>
        <div class=""><input type="text" maxlength="16" v-model="tmpEditInfo.studentName" placeholder="请填写姓名" class="c-fc-xblack c-textAlign-r c-fs24 c-bd0" @input="changeName(tmpEditInfo.studentName)" /></div>
      </div>
      <div class="c-hh80 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center">
        <div class=""><span class="c-mr6 c-fc-xlred c-fs28">*</span>手机号</div>
        <div class=""><input type="tel" maxlength="11" v-model="tmpEditInfo.mobile" placeholder="用于接收预约及课程信息" class="c-fc-xblack c-textAlign-r c-fs24 c-bd0" @input="changeMobile(tmpEditInfo.mobile)" /></div>
      </div>
      <div class="c-hh80 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center" v-if="fromType == 2">
        <div class=""><span class="c-mr6 c-fc-xlred c-fs28">*</span>验证码</div>
        <div class="c-flex-row">
          <input type="tel" maxlength="4" placeholder="请输入短信验证码" class="c-textAlign-r c-fs24 c-bd0" v-model="code" @input="code=code.slice(0, 4)">
          <div class="c-ml20 theme-bg-gradient c-fc-white c-br21 c-ww130 c-hh42 c-lh42 c-fs20 c-textAlign-c" @click="sendCode">{{textTip}}</div>
        </div>
      </div>
    </div>
    <div class="c-w100 c-hh16 c-bg-f6"></div>
    <div class="c-fs24 c-fc-xblack c-ph24">
      <div class=" c-p">
        <div class="c-flex-row c-aligni-center c-justify-sb c-hh80 c-bd-b1" @click="clickChoosePic">
          <div class="">头像</div>
          <img :src="$addXossFilter((headUrl || defultHeadUrl), require('../../assets/defult_head.png'))" alt class="c-brp50 c-ww60 c-hh60" />
        </div>
        <input v-if="!isWeiXin" class="c-w100 c-hh80 c-pa c-opacity0 c-p-t0 c-p-l0" ref="uploadImg" name="file" type="file" accept="image/*" @change="clickChoosePic($event)" />
      </div>
      <div class="c-flex-row c-aligni-center c-justify-sb c-hh80 c-bd-b1" v-if="requiredFields && requiredFields.isShowSex == 1">
        <div class=""><span class="c-mr6 c-fc-xlred c-fs28" v-if="requiredFields.isNeedSex == 1">*</span>性别</div>
        <div class="c-flex-row c-aligni-center c-w82" :class="sexValue[0] != '请选择'?'c-fc-xblack':'c-fc-sgray'" v-if="sexData">
          <popup-picker :themeColor="$getThemeColor()" @on-change="changeSexMethod" :data="sexData" class="c-flex-grow1 sexPlaceholder" :title="''" v-model="sexValue" placeholder="请选择性别"></popup-picker>&nbsp;
          <span class="iconfont c-fc-sgray c-fs16">&#xe60e;</span>
        </div>
      </div>
      <div class="c-flex-row c-aligni-center c-justify-sb c-hh80 c-bd-b1" v-if="requiredFields && requiredFields.isShowBirth == 1">
        <div class=""><span class="c-mr6 c-fc-xlred c-fs28" v-if="requiredFields.isNeedBirth == 1">*</span>生日</div>
        <div class="c-flex-row c-aligni-center c-justify-end c-w0 c-flex-grow1">
          <group class="birthdayPlaceholder c-w80 c-textAlign-r">
            <datetime title="" :themeColor="$getThemeColor()" v-model="tmpEditInfo.birthday" @on-change="changeBirthdayMethod" :start-date="startDate" :end-date="endDate" placeholder="请选择日期"></datetime>
          </group>
          <span v-if="age !==''">&nbsp;({{age}}岁) </span>
          <div class="iconfont c-fs16 c-fc-sgray c-ml10">&#xe60e;</div>
        </div>
      </div>
      <div class="c-flex-row c-aligni-center c-justify-sb c-hh80 c-bd-b1" v-if="requiredFields && requiredFields.isShowGrade == 1">
        <div class=""><span class="c-mr6 c-fc-xlred c-fs28" v-if="requiredFields.isNeedGrade == 1">*</span>年级</div>
        <div class="c-flex-row c-aligni-center c-w82" v-if="gradeList">
          <group class="c-w100 c-textAlign-r gradePlaceholder">
            <popup-picker :themeColor="$getThemeColor()" :title="''" v-model="gradeValue" :data="gradeList" @on-change="changeGrade" placeholder="请选择年级"></popup-picker>
          </group>
          <div class="iconfont c-fs16 c-fc-sgray c-ml10">&#xe60e;</div>
        </div>
      </div>
      <div class=" c-hh80 c-bd-b1 c-w100 c-flex-row c-justify-sb c-aligni-center" v-if="requiredFields && requiredFields.isShowWx == 1">
        <div class=""><span class="c-mr6 c-fc-xlred c-fs28" v-if="requiredFields.isNeedWx == 1">*</span>微信号</div>
        <div class=""><input type="text " placeholder="便于老师沟通联系" class="c-textAlign-r c-fc-xblack c-fs24 c-bd0" v-model="tmpEditInfo.wxNo"></div>
      </div>
      <div class="c-flex-row c-aligni-center c-justify-sb c-hh80 c-bd-b1" v-if="requiredFields && requiredFields.isShowAddress == 1">
        <div class=""><span class="c-mr6 c-fc-xlred c-fs28" v-if="requiredFields.isNeedAddress == 1">*</span>联系地址</div>
        <div class="c-flex-row c-aligni-center c-w77" v-if="addressDataList">
          <group class="c-w100 c-textAlign-r c-fc-xblack addressSelected">
            <x-address :themeColor="$getThemeColor()" :title="''" v-model="addrValue" :list="addressDataList" :rawValue="true" placeholder="请选择地址" class="c-flex-grow1"></x-address>
          </group>
          <div class="iconfont c-fs16 c-fc-sgray c-ml10" v-if="addressData == ''">&#xe60e;</div>
        </div>
      </div>
      <div class=" c-hh80 c-bd-b1 c-w100 c-flex-row c-aligni-center c-w100" v-if="requiredFields && requiredFields.isShowAddress == 1">
        <div class="c-w100"><input type="text" v-model="tmpEditInfo.details" placeholder="填写街道、楼牌号等" class="c-fc-xblack c-textAlign-r c-fs24 c-bd0 c-w100" /></div>
      </div>
      <block v-if="requiredFields && requiredFields.custom">
        <template v-for="(item, index) in requiredFields.custom">
          <div :key="index" v-if="(item.dataType != 4 && item.dataType != 5 && item.dataType != 8) && item.isShow == 1" class="c-flex-row c-aligni-center c-justify-sb c-hh80 c-bd-b1">
            <div class=""><span class="c-mr6 c-fc-xlred c-fs28" v-if="item.isNeed == 1">*</span>{{item.title}}</div>
            <div class="c-flex-row c-aligni-center c-w70">
              <group v-if="item.dataType == 6 && addressDataList.length > 0" class="c-w100 c-textAlign-r c-fc-xblack addressSelected">
                <x-address :themeColor="$getThemeColor()" :title="''" @on-hide="hideAddrss(item.id)" v-model="customValue[item.id].ids" :list="addressDataList" placeholder="请选择地址" class="c-flex-grow1"></x-address>
              </group>
              <popup-picker v-if="item.dataType == 7" :themeColor="$getThemeColor()" :title="''" v-model="customValue[item.id]" placeholder="请选择" :data="item.selectList" class="c-flex-grow1 sexPlaceholder"></popup-picker>
              <group v-if="item.dataType == 3" class="birthdayPlaceholder c-w100 c-textAlign-r">
                <datetime title="" :themeColor="$getThemeColor()" v-model="customValue[item.id]" placeholder="请选择日期" :start-date="startDate" :end-date="'2100-01-01'"></datetime>
              </group>
              <div v-if="item.dataType == 3 || item.dataType == 6 || item.dataType == 7" class="iconfont c-fs16 c-fc-sgray c-ml10">&#xe60e;</div>
              <input v-if="item.dataType == 2" type="number" placeholder="请输入数字" v-model="customValue[item.id]" class="c-fc-xblack c-textAlign-r c-fs24 c-bd0 c-w100"/>
              <input v-if="item.dataType == 1" type="text" maxlength="60" placeholder="请输入60个以内的字" v-model="customValue[item.id]" class="c-fc-xblack c-textAlign-r c-fs24 c-bd0 c-w100"/>
            </div>
          </div>
          <div :key="index" v-else-if="(item.dataType == 4 || item.dataType == 5 || item.dataType == 8) && item.isShow == 1" class="c-bd-b1 c-pv28"><!--单选，多选，多文本-->
            <div class=""><span class="c-mr6 c-fc-xlred c-fs28" v-if="item.isNeed == 1">*</span>{{item.title}}</div>
            <div class="c-w100">
              <textarea-com v-if="item.dataType == 8" class="textareaClass c-pt28" placeholder="请输入200个以内的字" :value="customValue[item.id]" @onChangeInput="customValue[item.id] = $event" maxLength="200" :showLength="true" @focus='inputFocus' @on-blur='inputBlur(item)'></textarea-com>
              <!-- 单选 -->
              <block v-if="item.dataType == 4">
                <div v-for="(sitem, sindex) in item.selectList" :key="sindex" class="c-flex-row c-aligni-center c-pt28" @click="customValue[item.id] = sitem.id">
                  <i class="iconfont c-fs26 c-mr16" :class="getCustValue(item.id) == sitem.id ? 'theme-fc' : 'c-fc-gray'">{{getCustValue(item.id) == sitem.id ? '&#xe6b1;' : '&#xe6f7;'}}</i>
                  <span>{{ sitem.title }}</span>
                </div>
              </block>

              <!-- 多选 -->
              <block v-if="item.dataType == 5">
                <div v-for="(ditem, dindex) in item.selectList" :key="dindex" class="c-flex-row c-aligni-center c-w100 c-pt28" @click="custSelectMu(item.id, ditem.id)">
                  <span class="c-mr16 mt2 c-ww24 c-hh24" :class="getCustValue(item.id) != '' && getCustValue(item.id).indexOf(ditem.id) > -1 ? 'theme-bg' : 'c-bg-white c-bd1-gray'">
                    <i class="iconfont c-fs20 c-fc-white" :class="getCustValue(item.id) != '' && getCustValue(item.id).indexOf(ditem.id) > -1 ? 'check-trans' : ''">{{getCustValue(item.id) != '' && getCustValue(item.id).indexOf(ditem.id) > -1 ? '&#xe6ea;' : ''}}</i>
                  </span>
                  <span class="c-w100">{{ ditem.title }}</span>
                </div>
              </block>
            </div>
          </div>
        </template>
      </block>
    </div>
    <!-- 底栏 -->
    <div class="c-pf c-pz100 c-p-b0 c-w100 c-maxw640 c-bg-white c-hh100 c-flex-row c-aligni-center c-justify-end c-ph24">
      <div class="c-hh64 theme-bg-gradient c-br40 c-fc-white c-fs28 c-flex-row c-aligni-center c-justify-center c-w100" @click="save">保存</div>
    </div>
    <my-loading :showLoading="isLoading"></my-loading>
  </div>
</template>

<script>
import textareaCom from "@/components/templates/common/textareaCom.vue"
import { utilJs, wxUtilJs } from "@/utils/common.js"
import { Datetime, PopupPicker, XAddress } from 'ckjrweb-mp-ui/src/components/index';
import myLoading from "@/plugin/loading/loading.vue";
let inputScrollTop = 0;
let studentId = "";
let num = 60;
let isClickBtn = false;
let imgData = {};
//自定义字段的类型：dataType1: '文本',2: '数字',3: '日期',4: '单选',5: '多选',6: '省市区',7: '性别',8: '多文本'
export default {
  name: 'EditStuInfo',
  components: {
    Datetime,
    PopupPicker,
    XAddress,
    myLoading,
    textareaCom
  },
  props: [],
  beforeCreate() {},
  data() {
    return {
      theme: localStorage.getItem("colorName") ? localStorage.getItem("colorName") : "mb5_default",
      addressData: "",
      sexValue: ["请选择"],
      sexData: [["男", "女"]],
      showAddress: false,
      editInfo: [],
      isClick: false,
      interval: null,
      textTip: "获取验证码",
      fromType: "", //0表示新增学员 1表示编辑学员信息 2表示面授课学员管理中编辑 3 从学员管理来的添加
      requiredFields: null, // 必填
      gradeValue: [],
      gradeList: [['一年级', '二年级', '三年级', '四年级', '五年级', '六年级', '初一', '初二', '初三', '高一', '高二', '高三', '大学', '其他']],
      address: '',
      code: "",
      studentGade: "",
      birthdayStauts: false,
      addrValue: [],
      addressDataList: '',
      tmpEditInfo: {
        areaCode: 0,
        birthday: '',
        cityCode: 0,
        companyId: 0,
        grade: 0,
        mobile: "",
        provinceCode: 0,
        studentId: 0,
        studentName: "",
        studentSex: 0,
        wxNo: "",
        details: "",
        isBind: 1,
      },
      extId: "",
      jwSaleCourseSpecId: "",
      type: "",
      isLoading: false,
      startDate: "1920-01-01", //默认从2000年起
      endDate: "",
      isWeiXin: true,
      headUrl: null,
      girlHeadUrl: this.$addXossFilter('https://knowledge-payment.oss-cn-beijing.aliyuncs.com/goodsBanners/2020-05-11/sbM2pllKIy4XBL6YvzVWg3fGy7e86dZWxGqeGolZ.png'),
      boyHeadUrl: this.$addXossFilter('https://knowledge-payment.oss-cn-beijing.aliyuncs.com/goodsBanners/2020-05-11/A9DusxF83dvjP350bfy4L4FskZTvDmpRde96Ezoq.png'),
      defultHeadUrl: this.$addXossFilter('https://knowledge-payment.oss-cn-beijing.aliyuncs.com/goodsBanners/2020-05-11/PehFKbnKSxefJgdSicZ84CV8LmPKLmdBwA8WmbuR.png'),
      age: "",
      isSale: '',
      pId: '',
      customValue: {}, //自定义字段的值
    }
  },
  created() {
    utilJs.appShare(this);
  },
  mounted() {

  },
  computed: {

  },
  watch: {

  },
  methods: {
    //IOS微信6.7以上版本会导致输入法收起的时候，键盘没收起，需要手动滚下屏幕
    inputFocus() {
      if (navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)) {
        inputScrollTop = document.documentElement.scrollTop || document.body.scrollTop;
      }
    },
    inputBlur(item) {
      if (navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)) {
        setTimeout(() => {
          document.body.scrollTop = inputScrollTop - 1 || 0;
        });
      }
    },
    hideAddrss(id) { //自定义的地址
      let addrArr = this.customValue[id].ids;
      let names = [];
      let ns = this.addressDataList.filter(ele => ele.value == addrArr[0] || ele.value == addrArr[1] || ele.value == addrArr[2]);
      addrArr.forEach(ids => {
        ns.forEach(ele => {
          if (ele.value == ids) {
            names.push(ele.name);
          }
        });
      });
      this.$set(this.customValue[id], 'names', names);
    },
    //自定义多选
    custSelectMu(pid, cid) {
      if (this.customValue[pid].indexOf(cid) > -1) {
        this.customValue[pid].splice(this.customValue[pid].indexOf(cid), 1);
      } else {
        this.customValue[pid].push(cid);
      }
    },
    //自定义，通过id，或者对应的value
    getCustValue(id) {
      return this.customValue[id] || '';
    },
    //选择图片
    clickChoosePic(event) {
      if (this.isWeiXin) {
        let $this = this;
        wxUtilJs.chooseImage({
          count: 1, // 默认9
          sizeType: ["compressed"], // 可以指定是原图还是压缩图，默认二者都有
          sourceType: ["album", "camera"] // 可以指定来源是相册还是相机，默认二者都有
        }).then(localIds => {
          this.$loading.show({
            text: "上传中..."
          });
          wxUtilJs
            .uploadImage({ localId: localIds[0] })
            .then(serverId => {
              $this.syncUploadPic(serverId);
            })
            .catch(function (err) {
              console.log(err);
            });
        });
      } else {
        utilJs.imgUpload(event.target.files, imgData, 'edu', res => {
          this.headUrl = res;
          this.tmpEditInfo.avatar = res;
        }, fRes => { });
      }
    },
    //上传图片到服务器
    syncUploadPic(serverId) {
      let serverIdArr = [];
      serverIdArr.push(serverId);
      utilJs.postMethod(
        global.apiurl + "signCard/downWxImg",
        {
          serverId: JSON.stringify(serverIdArr),
          mediaType: 2
        },
        res => {
          this.$loading.hide();
          if (res.length > 0) {
            this.headUrl = res[0];
            this.tmpEditInfo.avatar = res[0];
          }
        }, failRes => {
          this.$loading.hide();
        });
    },
    changeName(name) {
      this.tmpEditInfo.studentName = name;
    },
    changeMobile(mobile) {
      this.tmpEditInfo.mobile = mobile;
    },
    changeSexMethod(val) {
      this.changeSex = val.toString() == '女' ? 2 : val.toString() == '男' ? 1 : 0;
      this.sexValue = this.changeSex == 1 ? ['男'] : this.changeSex == 2 ? ['女'] : [];
      this.tmpEditInfo.studentSex = this.changeSex;
      if (this.tmpEditInfo.avatar == '' || this.tmpEditInfo.avatar == null) {
        this.headUrl = this.tmpEditInfo.studentSex == 0 ? this.defultHeadUrl : this.tmpEditInfo.studentSex == 1 ? this.boyHeadUrl : this.girlHeadUrl;
      }
    },
    changeBirthdayMethod(birthday) {
      this.age = new Date().getFullYear() - Number(birthday.substr(0, 4));
      this.tmpEditInfo.birthday = birthday;
    },
    onShowGrade(val) {
      if (this.tmpEditInfo.grade == 0) {
        this.tmpEditInfo.grade = val;
      }
    },
    changeGrade(val) {
      this.gradeValue = val;
      let gradeIndex = 0;
      this.gradeList[0].forEach((item, index) => {
        if (item == this.gradeValue) {
          //数据库未知用0,前后端从一年级开始显示,数组gradeList索引加1才和前端后台同步
          gradeIndex = index + 1;
        }
      })
      this.tmpEditInfo.grade = gradeIndex;
    },
    //判断必填字段
    getRequired() {
      utilJs.getMethod(global.apiurl + "educationSystem/studentSetting", res => {
        this.requiredFields = res;
        if (res.custom && res.custom.length > 0) {
          for (let i = 0; i < res.custom.length; i++) {
            if (res.custom[i].dataType == 5 || res.custom[i].dataType == 7) { //多选
              this.$set(this.customValue, res.custom[i].id, []);
            } else if (res.custom[i].dataType == 6) {
              let obj = {
                ids: [],
                names: []
              }
              this.$set(this.customValue, res.custom[i].id, obj);
            } else {
              this.$set(this.customValue, res.custom[i].id, '');
            }
          }
        }
        if (this.fromType == 1 || this.fromType == 2) {
          setDocumentTitle("编辑学员信息");// eslint-disable-line
          this.getStudentInfo();
        } else {
          setDocumentTitle("新增学员");// eslint-disable-line
          this.getAddress();
        };
      });
    },
    getCode() {
      num--;
      this.textTip = num + "s";
      if (num == 0) {
        this.textTip = "发送验证码";
        num = 60;
        this.isClick = false;
        clearInterval(this.interval);
      }
    },
    sendCode() {
      if (!this.isClick) {
        this.isClick = true;
        this.interval = setInterval(this.getCode, 1000);
        utilJs.postMethod(global.apiurl + "educationSystem/student/sms", { mobile: this.tmpEditInfo.mobile }, res => { });
      }
    },
    save() {
      if (this.tmpEditInfo.studentName == "") {
        this.$showCjToast({
          text: "请输入姓名",
          type: "warn",
        });
        return;
      }
      if (this.tmpEditInfo.mobile == '') {
        this.$showCjToast({
          text: "请输入手机号码",
          type: "warn",
        });
        return;
      } else if (!utilJs.isPhoneNumber(this.tmpEditInfo.mobile)) {
        this.$showCjToast({
          text: "请输入有效手机号",
          type: "warn",
        });
        return;
      }
      if (this.code == '' && this.fromType == 2) {
        this.$showCjToast({
          text: "请输入验证码",
          type: "warn",
        });
        return;
      }
      if ((this.tmpEditInfo.studentSex == 0 && this.requiredFields.isNeedSex == 1 && this.requiredFields.isShowSex == 1) || (this.tmpEditInfo.birthday.length == 0 && this.requiredFields.isNeedBirth == 1 && this.requiredFields.isShowBirth == 1) || (this.tmpEditInfo.grade == 0 && this.requiredFields.isNeedGrade == 1 && this.requiredFields.isShowGrade == 1) || (this.tmpEditInfo.wxNo.length == 0 && this.requiredFields.isNeedWx == 1 && this.requiredFields.isShowWx == 1) || ((this.addrValue.length == 0 || this.tmpEditInfo.details.length == 0) && this.requiredFields.isNeedAddress == 1 && this.requiredFields.isShowAddress == 1)) {
        let msg = (this.tmpEditInfo.studentSex == 0 && this.requiredFields.isNeedSex == 1 && this.requiredFields.isShowSex == 1) ? '请输入性别' : (this.tmpEditInfo.birthday.length == 0 && this.requiredFields.isNeedBirth == 1 && this.requiredFields.isShowBirth == 1) ? '请输入生日' : (this.tmpEditInfo.grade == 0 && this.requiredFields.isNeedGrade == 1 && this.requiredFields.isShowGrade == 1) ? '请输入年级' : (this.tmpEditInfo.wxNo.length == 0 && this.requiredFields.isNeedWx == 1 && this.requiredFields.isShowWx == 1) ? '请输入微信号' : ((this.addrValue.length == 0 || this.tmpEditInfo.details.length == 0) && this.requiredFields.isNeedAddress == 1 && this.requiredFields.isShowAddress == 1) ? '请输入地址' : '';
        this.$showCjToast({
          text: msg,
          type: "warn",
        });
        return;
      }
      if (this.requiredFields && this.requiredFields.custom) {
        for (let i = 0; i < this.requiredFields.custom.length; i++) {
          let ci = this.requiredFields.custom[i];
          if (ci.isNeed == 1 && ci.isShow == 1) {
            if (ci.dataType == 5 || ci.dataType == 6 || ci.dataType == 7) {
              if (((ci.dataType == 5 || ci.dataType == 7) && this.customValue[ci.id].length == 0) || (ci.dataType == 6 && this.customValue[ci.id].ids.length == 0)) {
                this.$showCjToast({
                  text: "请选择" + ci.title,
                  type: "warn",
                });
                return;
              }
            } else {
              if (this.customValue[ci.id] == '') {
                let t = ci.dataType == 4 || ci.dataType == 3 ? "请选择" : '请输入';
                this.$showCjToast({
                  text: t + ci.title,
                  type: "warn",
                });
                return;
              }
            }
          }
        }
      }
      if (isClickBtn) {
        return;
      }
      if (this.isLoading) {
        return;
      }
      if (this.addrValue.length > 0) {
        this.tmpEditInfo.provinceCode = this.addrValue[0];
        this.tmpEditInfo.cityCode = this.addrValue[1];
        this.tmpEditInfo.areaCode = this.addrValue[2];
      }
      isClickBtn = true;
      this.isLoading = true;
      let data = {
        name: this.tmpEditInfo.studentName,
        mobile: this.tmpEditInfo.mobile,
        birthday: this.tmpEditInfo.birthday,
        grade: this.tmpEditInfo.grade,
        sex: this.tmpEditInfo.studentSex,
        wx_number: this.tmpEditInfo.wxNo,
        province: this.tmpEditInfo.provinceCode,
        city: this.tmpEditInfo.cityCode,
        area: this.tmpEditInfo.areaCode,
        provinceName: this.addrValue.length && this.addressDataList.filter(item => item.value == this.tmpEditInfo.provinceCode)[0].name,
        cityName: this.addrValue.length && this.addressDataList.filter(item => item.value == this.tmpEditInfo.cityCode)[0].name,
        areaName: this.addrValue.length && this.addressDataList.filter(item => item.value == this.tmpEditInfo.areaCode)[0].name,
        details: this.tmpEditInfo.details,
        avatar: (this.headUrl == this.girlHeadUrl || this.headUrl == this.boyHeadUrl || this.headUrl == this.defultHeadUrl) ? '' : this.headUrl,
        customValue: this.customValue,
      }
      if (this.fromType == 0 || this.fromType == 3) {
        //确认订单新增学员 或是 学员管理来新增
        utilJs.postMethod(global.apiurl + "educationSystem/student", data, res => {
          this.addrValue = [];
          this.isLoading = false;
          clearInterval(this.interval);
          num = 60;
          this.$showCjToast({
            text: "成功",
            type: "success",
          });
          if (this.fromType == 0) {
            setTimeout(res => {
              let pathQuery = {
                extId: this.extId,
                jwSaleCourseSpecId: this.jwSaleCourseSpecId,
                type: this.type,
              }
              if (this.isSale == 1) {
                pathQuery.isSale = this.isSale;
                pathQuery.pId = this.pId;
              } else {
                pathQuery.isSale = this.isSale;
                pathQuery.cId = this.$route.query.cId;
                pathQuery.collageId = this.$route.query.collageId;
                pathQuery.groupId = this.$route.query.groupId;
                pathQuery.prodId = this.$route.query.prodId;
              }
              if (this.goodsRoomId) {
                pathQuery.goodsRoomId = this.goodsRoomId;
              }
              isClickBtn = false;
              this.$routerGo(this, "replace", {
                path: "/edu/confirmOrder",
                query: pathQuery
              })
            }, 3000)
          } else {
            setTimeout(res => {
              isClickBtn = false;
              this.$routerGo(this, "push", {
                path: "/edu/faceTeaching",
                query: {
                  comeFrom: 1,
                }
              })
            }, 3000)
          }
        }, failRes => {
          isClickBtn = false;
          this.isLoading = false;
        });
      } else if (this.fromType == 1) {
        data._method = "put";
        utilJs.postMethod(global.apiurl + "educationSystem/student/" + Number(this.editInfo.studentId), data, res => {
          this.isLoading = false;
          clearInterval(this.interval);
          num = 60;
          this.$showCjToast({
            text: "成功",
            type: "success",
          });
          setTimeout(res => {
            let pathQuery = {
              extId: this.extId,
              jwSaleCourseSpecId: this.jwSaleCourseSpecId,
              type: this.type,
            }
            if (this.isSale == 1) {
              pathQuery.isSale = this.isSale;
              pathQuery.pId = this.pId;
            } else {
              pathQuery.isSale = this.isSale;
              pathQuery.cId = this.$route.query.cId;
              pathQuery.collageId = this.$route.query.collageId;
              pathQuery.groupId = this.$route.query.groupId;
              pathQuery.prodId = this.$route.query.prodId;
            }
            isClickBtn = false;
            this.$routerGo(this, "replace", {
              path: "/edu/confirmOrder",
              query: pathQuery
            })
          }, 3000)
        }, failRes => {
          isClickBtn = false;
          this.isLoading = false;
        });
      } else {
        if (this.code != '') {
          data._method = "put";
          data.code = Number(this.code);
          utilJs.postMethod(global.apiurl + "educationSystem/student/" + Number(this.editInfo.studentId), data, res => {
            this.isLoading = false;
            clearInterval(this.interval);
            num = 60;
            this.$showCjToast({
              text: "成功",
              type: "success",
            });
            setTimeout(res => {
              isClickBtn = false;
              this.$routerGo(this, "push", {
                path: "/edu/faceTeaching",
                query: {
                  comeFrom: 1,
                }
              })
            }, 3000)
          }, failRes => {
            isClickBtn = false;
            this.isLoading = false;
          });
        }
      }
    },
    getAddress() {
      utilJs.getMethod(`${global.apiurl}common/getAreaListForAgent`, res => {
        this.addressDataList = res.data;
        this.$nextTick(() => {
          if (this.tmpEditInfo.provinceCode && Number(this.tmpEditInfo.provinceCode) != 0 && (this.fromType == 1 || this.fromType == 2)) {
            this.addrValue = [this.tmpEditInfo.provinceCode + '', this.tmpEditInfo.cityCode + '', this.tmpEditInfo.areaCode + ''];
          } else {
            this.addrValue = [];
          }
        })
      }, failRes => {
      });
    },
    getStudentInfo() {
      let _this = this;
      // 获取学员详情
      utilJs.getMethod(global.apiurl + "educationSystem/studentInfo/" + studentId, res => {
        if (res) {
          this.tmpEditInfo = res;
          if (res.customValue && res.customValue != null) { //进行重新赋值，目的是防止后台新增，导致值是错的
            for (let key in this.customValue) {
              if (res.customValue[key]) {
                this.customValue[key] = res.customValue[key];
              }
            };
          }
          // 当pc端解除绑定得时候，isBind字段 -1解绑 1正常
          if (this.tmpEditInfo.isBind == 1) {
            this.tmpEditInfo.birthday = this.tmpEditInfo.birthday == "0000-00-00" || this.tmpEditInfo.birthday == null || this.tmpEditInfo.birthday == '' ? '' : this.tmpEditInfo.birthday;
            if (this.tmpEditInfo.birthday != '') {
              this.age = new Date().getFullYear() - Number(this.tmpEditInfo.birthday.substr(0, 4));
            }
            if (this.tmpEditInfo.grade != 0) {
              let tmpGrade = this.gradeList[0][this.tmpEditInfo.grade - 1]
              this.gradeValue.push(tmpGrade);
            } else {
              this.gradeValue = [];
            }
            this.editInfo.studentId = studentId;
            this.headUrl = this.tmpEditInfo.avatar != '' && this.tmpEditInfo.avatar != null ? this.tmpEditInfo.avatar : this.tmpEditInfo.studentSex == 0 ? this.defultHeadUrl : this.tmpEditInfo.studentSex == 1 ? this.boyHeadUrl : this.girlHeadUrl;
            if (this.tmpEditInfo.studentSex != 0) {
              let sexType = this.tmpEditInfo.studentSex == 1 ? '男' : '女';
              this.sexValue.pop();
              this.sexValue.push(sexType);
            } else {
              this.sexValue.pop();
            }
            this.getAddress();
          } else {
            this.$showCjToast({
              text: "学员已解绑",
              type: "warn",
            }).then(() => {
              _this.$routerGo(_this, "push", {
                  path: "/edu/faceTeaching",
                  query: {
                    faceType: 3
                  }
                })
            });
          }
        }
      }, failRes => {
        this.$routerGo(this, "push", {
          path: "/edu/faceTeaching",
          query: {
            faceType: 3
          }
        })
      });
    },
    wechatShare: function () {
      let title = window.localStorage.getItem("shareTitle");
      let shareImg = window.localStorage.getItem("shareLogo");
      let shareUrl =
        window.location.href.split("#")[0] +
        "#/?refereeId=" +
        localStorage.getItem("userId");
      let shareDesc = window.localStorage.getItem("shareDesc");
      utilJs.wechatConfig(shareUrl, title, shareImg, shareDesc, function () { }, true);
    },
    //手机端分享
    appShare: function () {
      utilJs.appShareTrue("", "", "", "");
    },
  },
  activated() {
    this.type = this.$route.query.type;
    this.extId = this.$route.query.extId;
    this.jwSaleCourseSpecId = this.$route.query.jwSaleCourseSpecId;
    studentId = this.$route.query.studentId ? Number(this.$route.query.studentId) : '';
    this.fromType = this.$route.query.fromType;
    this.goodsRoomId = this.$route.query.goodsRoomId || '';
    num = 60;
    this.textTip = "获取验证码";
    clearInterval(this.interval);
    this.interval = null;
    this.isClick = false;
    isClickBtn = false;
    this.isLoading = false;
    this.code = "";
    this.startDate = "1920-01-01";
    this.endDate = utilJs.dateFormat(Date.now());
    this.birthdayStauts = false;
    this.interval = null;
    this.editInfo = [];
    this.changeSex = 0;
    this.sexValue = [];
    this.gradeValue = [];
    this.customValue = {};
    this.tmpEditInfo = {
      areaCode: 0,
      birthday: '',
      cityCode: 0,
      companyId: 0,
      grade: 0,
      mobile: "",
      provinceCode: 0,
      studentId: 0,
      studentName: "",
      studentSex: 0,
      wxNo: "",
      details: "",
      avatar: '',
    }
    this.addrValue = [];
    this.addressData = '';
    this.requiredFields = null;
    this.headUrl = null;
    this.age = "";
    this.isWeiXin = utilJs.isWeiXin();
    this.isSale = this.$route.query.isSale;
    this.pId = this.$route.query.pId;
    //获取阿里云签名，除了微信浏览器以外
    if (!utilJs.isWeiXin()) {
      utilJs.getAliSign(`${global.apiurl}imageSign`, res => {
        imgData = res;
      });
    }
    this.getRequired();
    this.wechatShare();
  },
  deactivated() {
    clearInterval(this.interval);
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
/* 重置样式 */
.editStuInfo /deep/ .vux-cell-value {
  color: #333!important;
}
.editStuInfo /deep/ .vux-tap-active:active,
.weui-cell_access:active {
  background-color: #fff!important;
}
.birthdayPlaceholder >>> .vux-cell-placeholder {
  color: #cccccc;
}
.sexPlaceholder >>> .vux-popup-picker-placeholder {
  color: #cccccc;
}
.gradePlaceholder >>> .vux-popup-picker-placeholder {
  color: #cccccc;
}
.addressSelected >>> .vux-popup-picker-placeholder {
  color: #cccccc;
}
.birthdayPlaceholder >>> .weui-cell__ft,
.sexPlaceholder >>> .weui-cell__ft,
.gradePlaceholder >>> .weui-cell__ft,
.addressSelected >>> .weui-cell__ft
 {
  padding: 0 !important;
}
.birthdayPlaceholder >>> .weui-cell,
.sexPlaceholder >>> .weui-cell,
.gradePlaceholder >>> .weui-cell,
.addressSelected >>> .weui-cell {
  padding: 0 !important;
}
.birthdayPlaceholder >>> .weui-cell__ft:after,
.sexPlaceholder >>> .weui-cell__ft:after,
.gradePlaceholder >>> .weui-cell__ft:after,
.addressSelected >>> .weui-cell__ft:after {
  display: none !important;
}
.editStuInfo /deep/ .loading-status {
  z-index: 10000!important;
}
.textareaClass /deep/ textarea{
  resize: none;
  height: 3rem;
}
</style>
